claude-code-templates 1.21.13 → 1.22.1

package/README.md

@@ -2,123 +2,125 @@
 [![npm downloads](https://img.shields.io/npm/dt/claude-code-templates.svg)](https://www.npmjs.com/package/claude-code-templates)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 [![Open Source](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://opensource.org/)
-[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](CONTRIBUTING.md)
+[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/davila7/claude-code-templates/blob/main/CONTRIBUTING.md)
 [![GitHub stars](https://img.shields.io/github/stars/davila7/claude-code-templates.svg?style=social&label=Star)](https://github.com/davila7/claude-code-templates)
-[![Mentioned in Awesome Claude Code](https://awesome.re/mentioned-badge-flat.svg)](https://github.com/hesreallyhim/awesome-claude-code)
-[![Buy Me a Coffee](https://img.shields.io/badge/☕-Buy%20me%20a%20coffee-ffdd00?style=flat&logo=buy-me-a-coffee)](https://buymeacoffee.com/daniavila)
 
+# Claude Code Templates
 
+**CLI tool for configuring and monitoring Claude Code** - Quick setup for any project with framework-specific commands and real-time monitoring dashboard.
 
-# Claude Code Templates (aitmpl.com)
-
-**Ready-to-use configurations for Anthropic's Claude Code.** A comprehensive collection of AI agents, custom commands, settings, hooks, external integrations (MCPs), and project templates to enhance your development workflow.
-
-## Browse & Install Components and Templates
-
-**[Browse All Templates](https://aitmpl.com)** - Interactive web interface to explore and install 100+ agents, commands, settings, hooks, and MCPs.
-
-<img width="1049" height="855" alt="Screenshot 2025-08-19 at 08 09 24" src="https://github.com/user-attachments/assets/e3617410-9b1c-4731-87b7-a3858800b737" />
-
-## 🚀 Quick Installation
+## 🚀 Quick Start
 
 ```bash
-# Install a complete development stack
-npx claude-code-templates@latest --agent frontend-developer --command generate-tests --mcp github-integration
-
-# Browse and install interactively
+# Interactive setup (recommended)
 npx claude-code-templates@latest
 
-# Install specific components
-npx claude-code-templates@latest --agent security-auditor
-npx claude-code-templates@latest --command optimize-bundle
-npx claude-code-templates@latest --setting mcp-timeouts
-npx claude-code-templates@latest --hook pre-commit-validation
-npx claude-code-templates@latest --mcp postgresql-integration
+# Real-time analytics dashboard
+npx claude-code-templates@latest --analytics
+
+# System health check
+npx claude-code-templates@latest --health-check
 ```
 
-## What You Get
+## ✨ Core Features
 
-| Component | Description | Examples |
-|-----------|-------------|----------|
-| **🤖 Agents** | AI specialists for specific domains | Security auditor, React performance optimizer, database architect |
-| **⚡ Commands** | Custom slash commands | `/generate-tests`, `/optimize-bundle`, `/check-security` |
-| **🔌 MCPs** | External service integrations | GitHub, PostgreSQL, Stripe, AWS, OpenAI |
-| **⚙️ Settings** | Claude Code configurations | Timeouts, memory settings, output styles |
-| **🪝 Hooks** | Automation triggers | Pre-commit validation, post-completion actions |
-| **📦 Templates** | Complete project configurations with CLAUDE.md, .claude/* files and .mcp.json | Framework-specific setups, project best practices |
+- **📋 Smart Project Setup** - Auto-detect and configure any project with framework-specific commands
+- **📊 Real-time Analytics** - Monitor Claude Code sessions with live state detection and performance metrics
+- **🔍 Health Check** - Comprehensive system validation with actionable recommendations
+- **🧩 Individual Components** - Install specialized agents, commands, and MCPs individually
+- **🌍 Global Agents** - Create AI agents accessible from anywhere using Claude Code SDK
 
-## 🛠️ Additional Tools
+## 🎯 What You Get
 
-Beyond the template catalog, Claude Code Templates includes powerful development tools:
+| Component | Description | Example |
+|-----------|-------------|---------|
+| **CLAUDE.md** | Project-specific Claude Code configuration | Framework best practices, coding standards |
+| **Commands** | Custom slash commands for development tasks | `/generate-tests`, `/check-file`, `/optimize-bundle` |
+| **Agents** | AI specialists for specific domains | API security audit, React performance, database optimization |
+| **MCPs** | External service integrations | GitHub, databases, development tools |
+| **Analytics** | Real-time monitoring dashboard | Live session tracking, usage statistics, exports |
 
-### 📊 Claude Code Analytics
-Monitor your AI-powered development sessions in real-time with live state detection and performance metrics.
+## 🛠️ Supported Technologies
 
-```bash
-npx claude-code-templates@latest --analytics
-```
+| Language | Frameworks | Status |
+|----------|------------|---------|
+| **JavaScript/TypeScript** | React, Vue, Angular, Node.js | ✅ Ready |
+| **Python** | Django, Flask, FastAPI | ✅ Ready |
+| **Common** | Universal configurations | ✅ Ready |
+| **Go** | Gin, Echo, Fiber | 🚧 Coming Soon |
+| **Rust** | Axum, Warp, Actix | 🚧 Coming Soon |
 
-### 💬 Conversation Monitor  
-Mobile-optimized interface to view Claude responses in real-time with secure remote access.
+## 🌍 Global Agents (Claude Code SDK Integration)
+
+Create AI agents that can be executed from anywhere using the Claude Code SDK:
 
 ```bash
-# Local access
-npx claude-code-templates@latest --chats
+# Create a global agent (one-time setup)
+npx claude-code-templates@latest --create-agent customer-support
 
-# Secure remote access via Cloudflare Tunnel
-npx claude-code-templates@latest --chats --tunnel
+# Use the agent from anywhere
+customer-support "Help me with ticket #12345"
+sre-logs "Analyze error patterns in app.log"  
+code-reviewer "Review this PR for security issues"
 ```
 
-### 🔍 Health Check
-Comprehensive diagnostics to ensure your Claude Code installation is optimized.
+### Available Global Agents
+
+| Agent | Usage | Description |
+|-------|-------|-------------|
+| `customer-support` | `customer-support "query"` | AI customer support specialist |
+| `api-security-audit` | `api-security-audit "analyze endpoints"` | Security auditing for APIs |
+| `react-performance-optimization` | `react-performance-optimization "optimize components"` | React performance expert |
+| `database-optimization` | `database-optimization "improve queries"` | Database performance tuning |
+
+### Global Agent Management
 
 ```bash
-npx claude-code-templates@latest --health-check
-```
+# List installed global agents
+npx claude-code-templates@latest --list-agents
 
-## 📖 Documentation
+# Update an agent to latest version
+npx claude-code-templates@latest --update-agent customer-support
 
-**[📚 docs.aitmpl.com](https://docs.aitmpl.com/)** - Complete guides, examples, and API reference for all components and tools.
+# Remove an agent
+npx claude-code-templates@latest --remove-agent customer-support
+```
+
+### How It Works
 
-## Contributing
+1. **Download Agent**: Fetches the latest agent from GitHub
+2. **Generate Executable**: Creates a Node.js script that calls Claude Code SDK
+3. **Add to PATH**: Makes the agent available globally in your shell
+4. **Ready to Use**: Execute `agent-name "your prompt"` from any directory
 
-We welcome contributions! **[Browse existing templates](https://aitmpl.com)** to see what's available, then check our [contributing guidelines](CONTRIBUTING.md) to add your own agents, commands, MCPs, settings, or hooks.
+The agents use the Claude Code SDK internally to provide specialized AI assistance with domain-specific knowledge and best practices.
 
-**Please read our [Code of Conduct](CODE_OF_CONDUCT.md) before contributing.**
+## 📖 Documentation
 
-## Attribution
+**[📚 Complete Documentation](https://docs.aitmpl.com/)** - Comprehensive guides, examples, and API reference
 
-This collection includes components from multiple sources:
+Quick links:
+- [Getting Started](https://docs.aitmpl.com/docs/intro) - Installation and first steps
+- [Project Setup](https://docs.aitmpl.com/docs/project-setup/interactive-setup) - Configure your projects
+- [Analytics Dashboard](https://docs.aitmpl.com/docs/analytics/overview) - Real-time monitoring
+- [Individual Components](https://docs.aitmpl.com/docs/components/overview) - Agents, Commands, MCPs
+- [CLI Options](https://docs.aitmpl.com/docs/cli-options) - All available commands
 
-**Agents Collection:**
-- **wshobson/agents Collection** by [wshobson](https://github.com/wshobson/agents) - Licensed under MIT License (48 agents)
+## 🤝 Contributing
 
-**Commands Collection:**
-- **awesome-claude-code Commands** by [hesreallyhim](https://github.com/hesreallyhim/awesome-claude-code) - Licensed under CC0 1.0 Universal (21 commands)
+We welcome contributions! Browse available templates and components at **[aitmpl.com](https://aitmpl.com)**, then check our [contributing guidelines](https://github.com/davila7/claude-code-templates/blob/main/CONTRIBUTING.md).
 
 ## 📄 License
 
-This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+MIT License - see the [LICENSE](LICENSE) file for details.
 
 ## 🔗 Links
 
-- **🌐 Browse Templates**: [aitmpl.com](https://aitmpl.com)
+- **🌐 Browse Components**: [aitmpl.com](https://aitmpl.com)
 - **📚 Documentation**: [docs.aitmpl.com](https://docs.aitmpl.com)
-- **💬 Community**: [GitHub Discussions](https://github.com/davila7/claude-code-templates/discussions)
 - **🐛 Issues**: [GitHub Issues](https://github.com/davila7/claude-code-templates/issues)
-
-## ⭐ Star History
-
-<a href="https://star-history.com/#davila7/claude-code-templates&Date">
-  <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=davila7/claude-code-templates&type=Date&theme=dark" />
-    <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=davila7/claude-code-templates&type=Date" />
-    <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=davila7/claude-code-templates&type=Date" />
-  </picture>
-</a>
+- **💬 Discussions**: [GitHub Discussions](https://github.com/davila7/claude-code-templates/discussions)
 
 ---
 
-**⭐ Found this useful? Give us a star to support the project!**
-
-[![Buy Me A Coffee](https://img.buymeacoffee.com/button-api/?text=Buy%20me%20a%20coffee&slug=daniavila&button_colour=FFDD00&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=ffffff)](https://buymeacoffee.com/daniavila)
+**⭐ Found this useful? Give us a star to support the project!**

package/{cli-tool/bin → bin}/create-claude-config.js

@@ -58,6 +58,7 @@ program
   .option('--chats', 'launch mobile-first chats interface (AI-optimized for mobile devices)')
   .option('--agents', 'launch Claude Code agents dashboard (opens directly to conversations)')
   .option('--chats-mobile', 'launch mobile-first chats interface (AI-optimized for mobile devices)')
+  .option('--plugins', 'launch Plugin Dashboard to view marketplaces, installed plugins, and permissions')
   .option('--tunnel', 'enable Cloudflare Tunnel for remote access (use with --analytics or --chats)')
   .option('--verbose', 'enable verbose logging for debugging and development')
   .option('--health-check, --health, --check, --verify', 'run comprehensive health check to verify Claude Code setup')
@@ -66,6 +67,7 @@ program
   .option('--mcp <mcp>', 'install specific MCP component (supports comma-separated values)')
   .option('--setting <setting>', 'install specific setting component (supports comma-separated values)')
   .option('--hook <hook>', 'install specific hook component (supports comma-separated values)')
+  .option('--skill <skill>', 'install specific skill component (supports comma-separated values)')
   .option('--workflow <workflow>', 'install workflow from hash (#hash) OR workflow YAML (base64 encoded) when used with --agent/--command/--mcp')
   .option('--prompt <prompt>', 'execute the provided prompt in Claude Code after installation or in sandbox')
   .option('--create-agent <agent>', 'create a global agent accessible from anywhere (e.g., customer-support)')

package/package.json

@@ -1,21 +1,69 @@
 {
   "name": "claude-code-templates",
-  "version": "1.21.13",
-  "description": "Component templates and tracking system for Claude Code",
-  "main": "cli-tool/src/index.js",
+  "version": "1.22.1",
+  "description": "CLI tool to setup Claude Code configurations with framework-specific commands, automation hooks and MCP Servers for your projects",
+  "main": "src/index.js",
   "bin": {
-    "claude-code-templates": "cli-tool/bin/create-claude-config.js",
-    "cct": "cli-tool/bin/create-claude-config.js"
+    "create-claude-config": "bin/create-claude-config.js",
+    "claude-code-templates": "bin/create-claude-config.js",
+    "claude-code-template": "bin/create-claude-config.js",
+    "claude-init": "bin/create-claude-config.js",
+    "cctemplates": "bin/create-claude-config.js",
+    "cct": "bin/create-claude-config.js",
+    "claude-setup": "bin/create-claude-config.js",
+    "claude-config": "bin/create-claude-config.js"
   },
   "scripts": {
-    "dev": "vercel dev",
-    "build": "echo 'Build complete'",
-    "start": "vercel dev",
-    "test": "echo 'No tests specified'",
-    "agent:security-auditor": "security-auditor 'Security audit covering codebase, dependencies, and deployment configuration'"
+    "start": "node bin/create-claude-config.js",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "test:unit": "jest tests/unit",
+    "test:integration": "jest tests/integration",
+    "test:e2e": "jest tests/e2e",
+    "test:analytics": "jest --testPathPattern=analytics",
+    "test:commands": "./test-commands.sh",
+    "test:detailed": "./test-detailed.sh",
+    "test:react": "make test-react",
+    "test:vue": "make test-vue",
+    "test:node": "make test-node",
+    "test:all": "npm run test:coverage && make test",
+    "dev:link": "npm link",
+    "dev:unlink": "npm unlink -g claude-code-templates",
+    "pretest:commands": "npm run dev:link",
+    "analytics:start": "node src/analytics.js",
+    "analytics:test": "npm run test:analytics",
+    "security-audit": "node src/security-audit.js",
+    "security-audit:ci": "node src/security-audit.js --ci",
+    "security-audit:verbose": "node src/security-audit.js --verbose",
+    "security-audit:json": "node src/security-audit.js --json --output=security-report.json"
   },
+  "keywords": [
+    "claude",
+    "claude-code",
+    "ai",
+    "configuration",
+    "template",
+    "setup",
+    "cli",
+    "hooks",
+    "automation",
+    "javascript",
+    "typescript",
+    "react",
+    "vue",
+    "angular",
+    "nodejs",
+    "python",
+    "django",
+    "flask",
+    "fastapi",
+    "rust",
+    "go"
+  ],
+  "author": "Claude Code Templates",
+  "license": "MIT",
   "dependencies": {
-    "@vercel/postgres": "^0.10.0",
     "boxen": "^5.1.2",
     "chalk": "^4.1.2",
     "chokidar": "^3.5.3",
@@ -23,21 +71,31 @@
     "express": "^4.18.2",
     "fs-extra": "^11.1.1",
     "inquirer": "^8.2.6",
+    "js-yaml": "^4.1.0",
     "open": "^8.4.2",
     "ora": "^5.4.1",
     "uuid": "^11.1.0",
     "ws": "^8.18.3"
   },
-  "devDependencies": {
-    "@vercel/node": "^3.0.0"
+  "engines": {
+    "node": ">=14.0.0"
   },
-  "keywords": [
-    "claude-code",
-    "templates",
-    "components",
-    "tracking",
-    "analytics"
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/davila7/claude-code-templates.git"
+  },
+  "bugs": {
+    "url": "https://github.com/davila7/claude-code-templates/issues"
+  },
+  "homepage": "https://github.com/davila7/claude-code-templates#readme",
+  "files": [
+    "bin/",
+    "src/",
+    "components/sandbox/e2b/",
+    "README.md"
   ],
-  "author": "Claude Code Templates",
-  "license": "MIT"
+  "devDependencies": {
+    "jest": "^30.0.4",
+    "jest-watch-typeahead": "^3.0.1"
+  }
 }

package/{cli-tool/src → src}/analytics-web/chats_mobile.html

@@ -1576,20 +1576,20 @@
             async loadMoreMessages(conversationId, isInitialLoad = false) {
                 const chatMessages = document.getElementById('chatMessages');
                 if (!chatMessages) return;
-                
+
                 // Prevent concurrent loading
                 if (this.messagesPagination.isLoading || !this.messagesPagination.hasMore) {
                     return;
                 }
-                
+
                 // Ensure we're loading for the correct conversation
                 if (this.messagesPagination.conversationId !== conversationId) {
                     return;
                 }
-                
+
                 try {
                     this.messagesPagination.isLoading = true;
-                    
+
                     if (isInitialLoad) {
                         // Show loading state for initial load
                         chatMessages.innerHTML = `
@@ -1604,16 +1604,16 @@
                         // Show loading indicator at top for infinite scroll
                         this.showMessagesLoadingIndicator(true);
                     }
-                    
+
                     // Fetch paginated messages from the server
                     const response = await fetch(`/api/conversations/${conversationId}/messages?page=${this.messagesPagination.currentPage}&limit=${this.messagesPagination.limit}`);
-                    
+
                     if (!response.ok) {
                         throw new Error(`HTTP error! status: ${response.status}`);
                     }
-                    
+
                     const messagesData = await response.json();
-                    
+
                     if (messagesData && messagesData.messages) {
                         // Update pagination state - handle both paginated and non-paginated responses
                         if (messagesData.pagination) {
@@ -1625,24 +1625,25 @@
                             this.messagesPagination.hasMore = false;
                             this.messagesPagination.currentPage = 1;
                         }
-                        
+
                         // Get existing messages or initialize
                         let existingMessages = this.loadedMessages.get(conversationId) || [];
-                        
+
                         if (isInitialLoad) {
                             // For initial load, replace all messages (newest messages first)
                             existingMessages = messagesData.messages;
+                            // Render all messages for initial load
+                            this.renderCachedMessages(existingMessages, false);
                         } else {
                             // For infinite scroll, prepend older messages to the beginning
                             existingMessages = [...messagesData.messages, ...existingMessages];
+                            // Render ONLY the new messages (not all accumulated messages)
+                            this.renderCachedMessages(messagesData.messages, true);
                         }
-                        
+
                         // Cache the combined messages
                         this.loadedMessages.set(conversationId, existingMessages);
-                        
-                        // Render messages
-                        this.renderCachedMessages(existingMessages, !isInitialLoad);
-                        
+
                         // Setup scroll listener for infinite scroll (only on initial load)
                         if (isInitialLoad) {
                             this.setupMessagesScrollListener(conversationId);
@@ -1655,7 +1656,7 @@
                             // Update status based on conversation state
                             this.analyzeConversationStatus(existingMessages);
                         }
-                        
+
                     } else if (isInitialLoad) {
                         chatMessages.innerHTML = `
                             <div class="no-messages-found">

package/{cli-tool/src → src}/console-bridge.js

@@ -338,12 +338,12 @@ class ConsoleBridge extends EventEmitter {
       if (Math.random() > 0.7) { // Simulate occasional prompts
         this.handleDetectedPrompt(`Read file
 
-  Search(pattern: "(?:Yes|No|yes|no)(?:,\\s*and\\s*don't\\s*ask\\s*again)?", path: 
-  "../../../../../../../.claude/projects/-Users-danipower-Proyectos-Github-claude-code-templates", include: "*.jsonl")
+  Search(pattern: "(?:Yes|No|yes|no)(?:,\\s*and\\s*don't\\s*ask\\s*again)?", path:
+  "../../../../../../../.claude/projects/-Users-username-Projects-project-name", include: "*.jsonl")
 
 Do you want to proceed?
 ❯ 1. Yes
-  2. Yes, and add /Users/danipower/.claude/projects/-Users-danipower-Proyectos-Github-claude-code-templates as a working directory for this session
+  2. Yes, and add ~/.claude/projects/-Users-username-Projects-project-name as a working directory for this session
   3. No, and tell Claude what to do differently (esc)`);
       }
       

package/{cli-tool/src → src}/index.js

@@ -15,6 +15,7 @@ const { runMCPStats } = require('./mcp-stats');
 const { runAnalytics } = require('./analytics');
 const { startChatsMobile } = require('./chats-mobile');
 const { runHealthCheck } = require('./health-check');
+const { runPluginDashboard } = require('./plugin-dashboard');
 const { trackingService } = require('./tracking-service');
 const { createGlobalAgent, listGlobalAgents, removeGlobalAgent, updateGlobalAgent } = require('./sdk/global-agent-manager');
 
@@ -128,7 +129,7 @@ async function createClaudeConfig(options = {}) {
   }
   
   // Handle multiple components installation (new approach)
-  if (options.agent || options.command || options.mcp || options.setting || options.hook) {
+  if (options.agent || options.command || options.mcp || options.setting || options.hook || options.skill) {
     // If --workflow is used with components, treat it as YAML
     if (options.workflow) {
       options.yaml = options.workflow;
@@ -193,7 +194,14 @@ async function createClaudeConfig(options = {}) {
     await runAnalytics(options);
     return;
   }
-  
+
+  // Handle plugin dashboard
+  if (options.plugins) {
+    trackingService.trackAnalyticsDashboard({ page: 'plugins', source: 'command_line' });
+    await runPluginDashboard(options);
+    return;
+  }
+
   // Handle chats dashboard (now points to mobile chats interface)
   if (options.chats) {
     trackingService.trackAnalyticsDashboard({ page: 'chats-mobile', source: 'command_line' });
@@ -1383,6 +1391,104 @@ async function getAvailableAgentsFromGitHub() {
   }
 }
 
+async function installIndividualSkill(skillName, targetDir, options) {
+  console.log(chalk.blue(`💡 Installing skill: ${skillName}`));
+
+  try {
+    // Skills always use SKILL.md as the main file (Anthropic standard)
+    // Format: skills/skill-name/SKILL.md
+    const githubUrl = `https://raw.githubusercontent.com/davila7/claude-code-templates/main/cli-tool/components/skills/${skillName}/SKILL.md`;
+
+    console.log(chalk.gray(`📥 Downloading from GitHub (main branch)...`));
+
+    const response = await fetch(githubUrl);
+    if (!response.ok) {
+      if (response.status === 404) {
+        console.log(chalk.red(`❌ Skill "${skillName}" not found`));
+        console.log(chalk.yellow('Available skills: pdf-processing, excel-analysis, git-commit-helper, email-composer'));
+        return false;
+      }
+      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+    }
+
+    const skillContent = await response.text();
+
+    // Check if there are additional files to download (e.g., referenced .md files)
+    const additionalFiles = {};
+
+    // Look for references to additional files like [FORMS.md](FORMS.md)
+    const referencePattern = /\[([A-Z_]+\.md)\]\(\1\)/g;
+    let match;
+    const skillBaseName = skillName;
+
+    while ((match = referencePattern.exec(skillContent)) !== null) {
+      const referencedFile = match[1];
+      const referencedUrl = githubUrl.replace('SKILL.md', referencedFile);
+
+      try {
+        console.log(chalk.gray(`📥 Downloading referenced file: ${referencedFile}...`));
+        const refResponse = await fetch(referencedUrl);
+        if (refResponse.ok) {
+          const refContent = await refResponse.text();
+          additionalFiles[`.claude/skills/${skillBaseName}/${referencedFile}`] = {
+            content: refContent,
+            executable: false
+          };
+          console.log(chalk.green(`✓ Found referenced file: ${referencedFile}`));
+        }
+      } catch (error) {
+        // Referenced file is optional, continue if not found
+        console.log(chalk.gray(`  (Referenced file ${referencedFile} not found, continuing...)`));
+      }
+    }
+
+    // Create .claude/skills/skill-name directory (Anthropic standard structure)
+    const skillsDir = path.join(targetDir, '.claude', 'skills');
+    const skillSubDir = path.join(skillsDir, skillBaseName);
+    await fs.ensureDir(skillSubDir);
+
+    // Always use SKILL.md as filename (Anthropic standard)
+    const targetFile = path.join(skillSubDir, 'SKILL.md');
+
+    // Write the main skill file
+    await fs.writeFile(targetFile, skillContent, 'utf8');
+
+    // Write any additional files
+    for (const [filePath, fileData] of Object.entries(additionalFiles)) {
+      const fullPath = path.join(targetDir, filePath);
+      await fs.ensureDir(path.dirname(fullPath));
+      await fs.writeFile(fullPath, fileData.content, 'utf8');
+
+      if (fileData.executable) {
+        await fs.chmod(fullPath, '755');
+      }
+    }
+
+    if (!options.silent) {
+      console.log(chalk.green(`✅ Skill "${skillName}" installed successfully!`));
+      console.log(chalk.cyan(`📁 Installed to: ${path.relative(targetDir, targetFile)}`));
+      if (Object.keys(additionalFiles).length > 0) {
+        console.log(chalk.cyan(`📄 Additional files: ${Object.keys(additionalFiles).length}`));
+      }
+      console.log(chalk.cyan(`📦 Downloaded from: ${githubUrl}`));
+    }
+
+    // Track successful skill installation
+    trackingService.trackDownload('skill', skillName, {
+      installation_type: 'individual_skill',
+      target_directory: path.relative(process.cwd(), targetDir),
+      source: 'github_main',
+      has_additional_files: Object.keys(additionalFiles).length > 0
+    });
+
+    return true;
+
+  } catch (error) {
+    console.log(chalk.red(`❌ Error installing skill: ${error.message}`));
+    return false;
+  }
+}
+
 /**
  * Install multiple components with optional YAML workflow
  */
@@ -1395,7 +1501,8 @@ async function installMultipleComponents(options, targetDir) {
       commands: [],
       mcps: [],
       settings: [],
-      hooks: []
+      hooks: [],
+      skills: []
     };
     
     // Parse comma-separated values for each component type
@@ -1423,8 +1530,13 @@ async function installMultipleComponents(options, targetDir) {
       const hooksInput = Array.isArray(options.hook) ? options.hook.join(',') : options.hook;
       components.hooks = hooksInput.split(',').map(h => h.trim()).filter(h => h);
     }
-    
-    const totalComponents = components.agents.length + components.commands.length + components.mcps.length + components.settings.length + components.hooks.length;
+
+    if (options.skill) {
+      const skillsInput = Array.isArray(options.skill) ? options.skill.join(',') : options.skill;
+      components.skills = skillsInput.split(',').map(s => s.trim()).filter(s => s);
+    }
+
+    const totalComponents = components.agents.length + components.commands.length + components.mcps.length + components.settings.length + components.hooks.length + components.skills.length;
     
     if (totalComponents === 0) {
       console.log(chalk.yellow('⚠️  No components specified to install.'));
@@ -1437,6 +1549,7 @@ async function installMultipleComponents(options, targetDir) {
     console.log(chalk.gray(`   MCPs: ${components.mcps.length}`));
     console.log(chalk.gray(`   Settings: ${components.settings.length}`));
     console.log(chalk.gray(`   Hooks: ${components.hooks.length}`));
+    console.log(chalk.gray(`   Skills: ${components.skills.length}`));
     
     // Counter for successfully installed components
     let successfullyInstalled = 0;
@@ -1518,14 +1631,21 @@ async function installMultipleComponents(options, targetDir) {
     // Install hooks (using shared installation locations)
     for (const hook of components.hooks) {
       console.log(chalk.gray(`   Installing hook: ${hook}`));
-      const hookSuccess = await installIndividualHook(hook, targetDir, { 
-        ...options, 
-        silent: true, 
-        sharedInstallLocations: sharedInstallLocations 
+      const hookSuccess = await installIndividualHook(hook, targetDir, {
+        ...options,
+        silent: true,
+        sharedInstallLocations: sharedInstallLocations
       });
       if (hookSuccess > 0) successfullyInstalled++;
     }
-    
+
+    // Install skills
+    for (const skill of components.skills) {
+      console.log(chalk.gray(`   Installing skill: ${skill}`));
+      const skillSuccess = await installIndividualSkill(skill, targetDir, { ...options, silent: true });
+      if (skillSuccess) successfullyInstalled++;
+    }
+
     // Handle YAML workflow if provided
     if (options.yaml) {
       console.log(chalk.blue('\n📄 Processing workflow YAML...'));